<%@ page import="com.Constants" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Login</title>
    <link href="<%=request.getContextPath()%>/static/style/login.css" rel="stylesheet" type="text/css">
    <link href="<%=request.getContextPath()%>/static/style/reset.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="<%=request.getContextPath()%>/static/js/common.js"></script>
</head>
<style>
    .errorMessage {
        color: red;
    }
</style>
<script>
    function login() {
        var loginFormObj = document.getElementById("loginForm");
        var isSubmitForm = true;
        var userNameObj =  document.getElementById("userName");
        var userNameValue = userNameObj.value;

        var errorMsg = "";
        var errorMsgObj = document.getElementById("errorMsg");

        var userNameIsNull = false;
        var passwordIsNull = false;

        if (!userNameValue.trim()) {
            userNameIsNull = true;
            errorMsg = "请输入用户名";
            isSubmitForm = false;
            userNameObj.style.border = "1px dashed #EB340a";
        } else {
            userNameObj.style.cssText = "border: 1px solid #858585;";
        }
        var passwordObj = document.getElementById("password");
        var passwordValue = passwordObj.value;
        if (!passwordValue.trim()) {
            passwordIsNull = true;
            errorMsg = "请输入密码";
            isSubmitForm = false;
            passwordObj.style.border = "1px dashed #EB340a";
        } else {
            passwordObj.style.cssText = "border: 1px solid #858585;";
        }
        if (userNameIsNull && passwordIsNull) {
            errorMsg = "请输入用户名和密码";
        }
        if (!isSubmitForm) {
            errorMsgObj.innerHTML = errorMsg;
            errorMsgObj.style.visibility = "visible";

        }
        if (isSubmitForm) {
            loginFormObj.submit();
        }
    }
</script>
<body>
<div class="login_title">奇文共欣赏 疑义相与新</div>
<%String tipMessage = (String)request.getAttribute(Constants.TIP_MESSAGE);
    String visibility = "hidden";
    if (tipMessage != null && !tipMessage.equals("")) {
        visibility = "visible";
    }
%>
<div class="login_form">
    <div class="logo"></div>
    <div class="title">图书分享平台</div>
    <form action="login.action" method="POST" id="loginForm">
        <div class="line">
            <label>用户名</label>
            <input type="text" name="userName" id="userName"/>
        </div>

        <div class="line" style="margin-top:20px">
            <label>密码</label>
            <input type="password" name="password" id="password"/>
        </div>
        <div id="errorMsg" class="line" style="margin-top: 10px;visibility: <%=visibility %>;color:red;font-size:14px;">
            <%=tipMessage %>
        </div>
        <div class="button" onclick="login()">登陆</div>
    </form>
</div>
<div class="login_footer">Copy Right@interesting.com.cn</div>
</body>
</html>